import { FormSchema } from "@/components/Form";
import { BasicColumn } from "@/components/Table";
import { h } from "vue";
import { Switch } from "ant-design-vue";
import { useMessage } from "@/hooks/web/useMessage";
import { setRoleStatus } from "@/api/system/role";
import { UpdateDictDataStatus, UpdateDictTypeStatus } from "@/api/system/dict";
type CheckedType = boolean | string | number;
import { useDictStore } from "@/store/modules/dict";
export const columns: BasicColumn[] = [
  {
    title: '字典编号',
    dataIndex: 'dictId',
    width: 200,
  },
  {
    title: '字典名称',
    dataIndex: 'dictName',
    width: 180,
  },
  {
    title: '字典类型',
    dataIndex: 'dictType',
    width: 180,
    slots: { customRender: 'dictType' },
  },
  {
    title: '状态',
    dataIndex: 'status',
    width: 120,
    customRender: ({ record }) => {
      if (!Reflect.has(record, 'pendingStatus')) {
        record.pendingStatus = false;
      }
      return h(Switch, {
        checked: record.status === 1,
        checkedChildren: '已启用',
        unCheckedChildren: '已禁用',
        loading: record.pendingStatus,
        onChange(checked: CheckedType) {
          record.pendingStatus = true;
          const newStatus = checked ? 1 : 0;
          const { createMessage } = useMessage();
          let params = {
            dict_id: record.dictId,
            status: newStatus
          }
          UpdateDictTypeStatus(params)
            .then(() => {
              record.status = newStatus;
              useDictStore().delDict(record.dictType);
              createMessage.success(`已成功修改字典状态`);
            })
            .catch(() => {
              createMessage.error('修改字典状态失败');
            })
            .finally(() => {
              record.pendingStatus = false;
            });
        },
      });
    },
  },
  {
    title: '备注',
    dataIndex: 'remark',
  },
  {
    title: '创建时间',
    dataIndex: 'createTime',
    width: 180,
    customRender: ({ text }) => {
      //时间戳转换位时间
      const date = new Date(text);
      const Y = date.getFullYear() + '-';
      const M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
      const D = date.getDate() + ' ';
      const h = date.getHours() + ':';
      const m = date.getMinutes() + ':';
      const s = date.getSeconds();
      return Y + M + D + h + m + s;
    }
  },

];
export const searchFormSchema: FormSchema[] = [
  {
    field: 'dictName',
    label: '字典名称',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'dictType',
    label: '字典类型',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'status',
    label: '字典状态',
    component: 'Select',
    componentProps: {
      options: [
        { label: '启用', value: 1 },
        { label: '停用', value: 0 },
      ],
    },
    colProps: { span: 6 },
  },
];
export const dictForm: FormSchema[] = [
  //字典名称
  {
    field: 'dictName',
    label: '字典名称',
    component: 'Input',
    required: true,
    colProps: { span: 24 },
  },
  //字典类型
  {
    field: 'dictType',
    label: '字典类型',
    component: 'Input',
    required: true,
    colProps: { span: 24 },
  },
  //状态
  {
    field: 'status',
    label: '状态',
    component: 'RadioButtonGroup',
    defaultValue: 1,
    componentProps: {
      options: [
        { label: '启用', value: 1 },
        { label: '停用', value: 0 },
      ],
    },
    colProps: { span: 24 },
  },
  //备注
  {
    field: 'remark',
    label: '备注',
    component: 'InputTextArea',
    colProps: { span: 24 },
  },
];
export const dictDataSearchSchema:FormSchema[] = [
  {
    field: 'dictLabel',
    label: '字典标签',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    field: 'status',
    label: '状态',
    component: 'Select',
    componentProps: {
      options: [
        { label: '启用', value: 1 },
        { label: '停用', value: 0 },
      ],
    },
    colProps: { span: 6 },
  },
];
export const dataColoumns: BasicColumn[] = [
  {
    title: '字典编码',
    dataIndex: 'dictCode',
    width: 200,
  },
  {
    title: '字典标签',
    dataIndex: 'dictLabel',
    width: 200,
  },
  {
    title: '字典键值',
    dataIndex: 'dictValue',
    width: 200,
  },
  {
    title: '字典排序',
    dataIndex: 'dictSort',
  },
  {
    title: '状态',
    dataIndex: 'status',
    customRender: ({ record }) => {
      if (!Reflect.has(record, 'pendingStatus')) {
        record.pendingStatus = false;
      }
      return h(Switch, {
        checked: record.status === 1,
        checkedChildren: '已启用',
        unCheckedChildren: '已禁用',
        loading: record.pendingStatus,
        onChange(checked: CheckedType) {
          record.pendingStatus = true;
          const newStatus = checked ? 1 : 0;
          const { createMessage } = useMessage();
          let params = {
            dictCode: record.dictCode,
            status: newStatus
          }
          UpdateDictDataStatus(params)
            .then(() => {
              record.status = newStatus;
              useDictStore().delDict(record.dictType);
              createMessage.success(`已成功修改字典状态`);
            })
            .catch(() => {
              createMessage.error('修改字典状态失败');
            })
            .finally(() => {
              record.pendingStatus = false;
            });
        },
      });
    },
  },
  {
    title: '创建时间',
    dataIndex: 'createTime',
    width: 180,
    customRender: ({ text }) => {
      //时间戳转换位时间
      const date = new Date(text);
      const Y = date.getFullYear() + '-';
      const M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
      const D = date.getDate() + ' ';
      const h = date.getHours() + ':';
      const m = date.getMinutes() + ':';
      const s = date.getSeconds();
      return Y + M + D + h + m + s;
    }
  },
  {
    title: '备注',
    dataIndex: 'remark',
    width: 200,
  },
];
export const dictDataForm: FormSchema[] = [
  //字典名称
  {
    field: 'dictType',
    label: '字典类型',
    component: 'Input',
    required: true,
    colProps: { span: 24 },
    componentProps:{
      disabled: true
    }
  },
  //字典类型
  {
    field: 'dictLabel',
    label: '数据标签',
    component: 'Input',
    required: true,
    colProps: { span: 24 },
  },
  {
    field: 'dictValue',
    label: '数据键值',
    component: 'Input',
    required: true,
    colProps: { span: 24 },
  },
  {
    field: 'cssClass',
    label: '样式属性',
    component: 'Input',
    colProps: { span: 24 },
  },
  {
    field: 'listClass',
    label: '回显样式',
    component: 'Select',
    colProps: { span: 24 },
    componentProps:{
      options:[
        {label:'默认【default】',value:'default'},
        {label:'主要【primary】',value:'primary'},
        {label:'成功【success】',value:'success'},
        {label:'信息【info】',value:'info'},
        {label:'警告【warning】',value:'warning'},
        {label:'危险【danger】',value:'danger'},
      ]
    }
  },
  {
    field: 'dictSort',
    label: '排序',
    component: 'InputNumber',
    required: true,
    defaultValue: 0
  },
  //状态
  {
    field: 'status',
    label: '状态',
    component: 'RadioButtonGroup',
    defaultValue: 1,
    componentProps: {
      options: [
        { label: '启用', value: 1 },
        { label: '停用', value: 0 },
      ],
    },
    colProps: { span: 24 },
  },
  //备注
  {
    field: 'remark',
    label: '备注',
    component: 'InputTextArea',
    colProps: { span: 24 },
  },
]
